import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:osg/controllers/custom_widget.dart';
import 'package:osg/controllers/http.dart';

class RankingList extends StatefulWidget {
  RankingList({super.key});

  @override
  State<RankingList> createState() => _SettingPageState();
}

class _SettingPageState extends State<RankingList> {
  RxList infoList = [].obs;
  RxList list = [].obs;
  RxMap myInfo = {}.obs;

  getInfo() {
    Get.find<HTTPS>().getData('/rank', {}).then((res) {
      if (res != null) {
        infoList.value = res;
      }
    });
  }

  getMyInfo() {
    Get.find<HTTPS>().getData('/myRank', {}).then((res) {
      if (res != null) {
        myInfo.value = res;
      }
    });
  }

  purchase(item,type) {
    if (item['show_buy'] == 0&&type==0) {
      Get.find<HTTPS>().showTost('用户隐藏了买入记录');
    } else {
      Get.find<HTTPS>().getData('/rankUserOrder', {
        'user_id':'${item['user_id']}',
        'page': '1',
        'per_page': '999',
      }).then((res) {
        if (res != null) {
          list.value = res['list'];
          Get.bottomSheet(
              isScrollControlled: true,
              shape: RoundedRectangleBorder(
                // 圆角设置:ml-citation{ref="7" data="citationList"}
                borderRadius: BorderRadius.vertical(top: Radius.circular(15)),
              ),
              backgroundColor: Colors.white,
              Padding(
                  padding: EdgeInsets.symmetric(horizontal: 15),
                  child: SizedBox(
                    height: 500,
                    child: ListView(
                      children: [
                        SizedBox(height: 15,),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Text(
                              '${item['name']}',
                              style: TextStyle(
                                  fontSize: 20, color: Color(0XFF0F172B)),
                            ),
                            GestureDetector(
                              onTap: () {
                                Get.back();
                              },
                              child: Image.asset(
                                'static/close.png',
                                width: 18,
                                fit: BoxFit.fitWidth,
                              ),
                            )
                          ],
                        ),
                        
                        if(list.isEmpty)
                        isdata(),
                        for(var item in list.asMap().entries)
                        Container(
                          margin: EdgeInsets.only(top: 15),
                            padding: EdgeInsets.symmetric(
                                horizontal: 15, vertical: 10),
                            decoration: BoxDecoration(
                                color: Color(0XFFF8F9FD),
                                borderRadius: BorderRadius.circular(10)),
                            child: Column(
                              children: [
                                Row(
                                  children: [
                                    
                                     ClipRRect(
                                      borderRadius: BorderRadius.circular(7),
                                      child: Image.network(
                                        '${item.value['thumb']}',
                                        width: 70,
                                        height: 70,
                                        fit: BoxFit.fill,
                                      ),
                                    )
                                    
                                   ,
                                    SizedBox(
                                      width: 10,
                                    ),
                                    Column(
                                      crossAxisAlignment:
                                          CrossAxisAlignment.start,
                                      children: [
                                        Text(
                                         '${item.value['title']}',
                                          style: TextStyle(
                                              fontSize: 14,
                                              color: Color(0XFF0F172B)),
                                        ),
                                        SizedBox(
                                          height: 5,
                                        ),
                                        Text(
                                          '购入价格：￥${item.value['money_price']}',
                                          style: TextStyle(
                                              fontSize: 12,
                                              color: Color(0XFF999999)),
                                        ),
                                        Text(
                                          '购入数量：${item.value['total']}',
                                          style: TextStyle(
                                              fontSize: 12,
                                              color: Color(0XFF999999)),
                                        ),
                                      ],
                                    ),
                                    Expanded(child: SizedBox()),
                                    GestureDetector(
                                      onTap: (){
                                         Get.find<HTTPS>().postData('/rankGot', {
                                              "order_id":'${item.value['order_id']}'
                                            }).then((resc){
                                              if(resc!=null){
                                                
                                              }
                                            });
                                      },
                                      child: Container(
                                      width: 50,
                                      margin: EdgeInsets.only(top: 45),
                                      alignment: Alignment.center,
                                      height: 22,
                                      decoration: BoxDecoration(
                                          borderRadius:
                                              BorderRadius.circular(25),
                                          color: Color(0XFF542AFF)),
                                      child: Text(
                                        '跟投',
                                        style: TextStyle(
                                            fontSize: 12,
                                            color: Color(0XFFFFFFFF)),
                                      ),
                                    ),
                                    )
                                    ,
                                  ],
                                ),
                                Divider(
                                  color: Color(0XFFDDDDDD),
                                  height: 40,
                                ),
                                Row(
                                  mainAxisAlignment:
                                      MainAxisAlignment.spaceBetween,
                                  children: [
                                    Text(
                                      '${item.value['created_at']}',
                                      style: TextStyle(
                                          fontSize: 12,
                                          color: Color(0XFF999999)),
                                    ),
                                    Text(
                                      '${item.value['got']}人跟投',
                                      style: TextStyle(
                                          fontSize: 12,
                                          color: Color(0XFF542AFF)),
                                    ),
                                  ],
                                )
                              ],
                            )),
                    
                      ],
                    ),
                  )));
        }
      });
    }
  }

  @override
  void initState() {
    super.initState();
    WidgetsBinding.instance.addPostFrameCallback((_) {
      getInfo();
      getMyInfo();
    });
  }

  @override
  Widget build(BuildContext context) {
    final totalHeight = MediaQuery.of(context).padding.top + 15;

    return Scaffold(
        body: Column(
      children: [
        Expanded(
          child: ListView(
            padding: EdgeInsets.only(top: 0),
            children: [
              Container(
                height: 480,
                decoration: BoxDecoration(
                  color: Color(0XFF333333),
                  image: DecorationImage(
                    image: AssetImage('static/web/bgpabg.png'),
                    fit: BoxFit.fitWidth,
                  ),
                ),
                child: Column(
                  children: [
                    SizedBox(
                      height: totalHeight,
                    ),
                    Padding(
                      padding: EdgeInsets.symmetric(horizontal: 15),
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          GestureDetector(
                            onTap: () {
                              Get.back();
                            },
                            child: Image.asset(
                              'static/web/bclose.png',
                              width: 16,
                              fit: BoxFit.fitWidth,
                            ),
                          ),
                          SizedBox(
                            width: 27,
                          ),
                          Expanded(child: SizedBox()),
                          Image.asset(
                            'static/web/paihangbang.png',
                            width: 72,
                            fit: BoxFit.fitWidth,
                          ),
                          Expanded(child: SizedBox()),
                          GestureDetector(
                            onTap: () =>
                                {Get.toNamed('/web_tabs/ranking/settings')},
                            child: Image.asset(
                              'static/web/shez.png',
                              width: 16,
                              fit: BoxFit.fitWidth,
                            ),
                          ),
                          SizedBox(
                            width: 15,
                          ),
                          GestureDetector(
                            onTap: () =>
                                {Get.toNamed('/web_tabs/ranking/rule')},
                            child: Image.asset(
                              'static/web/wenhao.png',
                              width: 16,
                              fit: BoxFit.fitWidth,
                            ),
                          ),
                        ],
                      ),
                    ),
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        SizedBox(
                          width: 5,
                        ),
                        Container(
                          padding: EdgeInsets.only(top: 120),
                          child: Column(
                            children: [
                              Container(
                                height: 60,
                                width: 60,
                                decoration: BoxDecoration(
                                    borderRadius: BorderRadius.circular(60),
                                    border: Border.all(
                                        width: 4, color: Color(0XFFFFFFFF))),
                                child: CircleAvatar(
                                    radius: 28,
                                    child: 
                                    Obx(()=>
                                      infoList.isNotEmpty?
                                    Image.network(
                                      '${infoList[1]['headimg']}',
                                      errorBuilder: (context, error, stackTrace) {
                                            return SizedBox(
                                              width: 20,
                                            );
                                        }
                                      ,
                                    ):SizedBox()
                                    )
                                    ,
                                )
                              ),
                              Container(
                                width: 80,
                                alignment: Alignment.center,
                                child: Obx(() => infoList.isNotEmpty
                                    ? Text(
                                        '${infoList[1]['name']}',
                                        overflow: TextOverflow.ellipsis,
                                        style: TextStyle(
                                            color: Color(0XFFFFFFFF),
                                            fontSize: 14),
                                      )
                                    : SizedBox()),
                              ),
                              Obx(() => infoList.isNotEmpty
                                  ? Row(
                                    mainAxisAlignment: MainAxisAlignment.center,
                                    children: [
                                       Text(
                                      '￥',
                                      style: TextStyle(
                                          fontSize: 12,
                                          color: Color(0XFFFFFFFF)),
                                    ),
                                     Text(
                                      '${infoList[1]['score']}',
                                      style: TextStyle(
                                          fontSize: 16,
                                          color: Color(0XFFFFFFFF)),
                                    )
                                    ],
                                  )
                                  
                                 
                                  : SizedBox()),
                              GestureDetector(
                                onTap: () {
                                  purchase(infoList[1],0);
                                },
                                child: Container(
                                  height: 20,
                                  padding: EdgeInsets.symmetric(horizontal: 10),
                                  alignment: Alignment.center,
                                  decoration: BoxDecoration(
                                      color: Color(0XFF0F172B),
                                      borderRadius: BorderRadius.circular(20)),
                                  child: Text(
                                    '今日买入',
                                    style: TextStyle(
                                        fontSize: 11, color: Color(0XFFFFFFFF)),
                                  ),
                                ),
                              )
                            ],
                          ),
                        ),
                        Container(
                          padding: EdgeInsets.only(top: 0),
                          child: Column(
                            children: [
                              Container(
                                height: 60,
                                width: 60,
                                decoration: BoxDecoration(
                                    borderRadius: BorderRadius.circular(60),
                                    border: Border.all(
                                        width: 4, color: Color(0XFFFFFFFF))),
                                child:CircleAvatar(
                                    radius: 28,
                                    child: Obx(()=>
                                      infoList.isNotEmpty?
                                    Image.network(
                                      '${infoList[0]['headimg']}',
                                      errorBuilder: (context, error, stackTrace) {
                                            return SizedBox(
                                              width: 20,
                                            );
                                        }
                                      ,
                                    ):SizedBox()
                                    )
                                    ,
                                )
                              ),
                              Container(
                                width: 80,
                                alignment: Alignment.center,
                                child: Obx(() => infoList.isNotEmpty
                                    ? Text(
                                        '${infoList[0]['name']}',
                                        overflow: TextOverflow.ellipsis,
                                        style: TextStyle(
                                            color: Color(0XFFFFFFFF),
                                            fontSize: 14),
                                      )
                                    : SizedBox()),
                              ),
                              Obx(() => infoList.isNotEmpty
                                  ? Row(
                                    mainAxisAlignment: MainAxisAlignment.center,
                                    children: [
                                       Text(
                                      '￥',
                                      style: TextStyle(
                                          fontSize: 12,
                                          color: Color(0XFFFFFFFF)),
                                    ),
                                     Text(
                                      '${infoList[0]['score']}',
                                      style: TextStyle(
                                          fontSize: 16,
                                          color: Color(0XFFFFFFFF)),
                                    )
                                    ],
                                  )
                                  : SizedBox()),
                              GestureDetector(
                                onTap: () {
                                  
                                  purchase(infoList[0],0);
                                },
                                child: Container(
                                  height: 20,
                                  padding: EdgeInsets.symmetric(horizontal: 10),
                                  alignment: Alignment.center,
                                  decoration: BoxDecoration(
                                      color: Color(0XFF0F172B),
                                      borderRadius: BorderRadius.circular(20)),
                                  child: Text(
                                    '今日买入',
                                    style: TextStyle(
                                        fontSize: 11, color: Color(0XFFFFFFFF)),
                                  ),
                                ),
                              )
                            ],
                          ),
                        ),
                        Container(
                          padding: EdgeInsets.only(top: 200),
                          child: Column(
                            children: [
                              Container(
                                height: 60,
                                width: 60,
                                decoration: BoxDecoration(
                                    borderRadius: BorderRadius.circular(60),
                                    border: Border.all(
                                        width: 4, color: Color(0XFFFFFFFF))),
                                child:CircleAvatar(
                                    radius: 28,
                                    child: Obx(()=>
                                    infoList.isNotEmpty?
                                    Image.network(
                                      '${infoList[2]['headimg']}',
                                      errorBuilder: (context, error, stackTrace) {
                                            return SizedBox(
                                              width: 20,
                                            );
                                        },
                                    ):SizedBox()
                                    )
                                    ,
                                )
                              ),
                              Container(
                                width: 80,
                                alignment: Alignment.center,
                                child: Obx(() => infoList.isNotEmpty
                                    ? Text(
                                        '${infoList[2]['name']}',
                                        overflow: TextOverflow.ellipsis,
                                        style: TextStyle(
                                            color: Color(0XFFFFFFFF),
                                            fontSize: 14),
                                      )
                                    : SizedBox()),
                              ),
                              Obx(() => infoList.isNotEmpty
                                  ? Row(
                                    mainAxisAlignment: MainAxisAlignment.center,
                                    children: [
                                       Text(
                                      '￥',
                                      style: TextStyle(
                                          fontSize: 12,
                                          color: Color(0XFFFFFFFF)),
                                    ),
                                     Text(
                                      '${infoList[2]['score']}',
                                      style: TextStyle(
                                          fontSize: 16,
                                          color: Color(0XFFFFFFFF)),
                                    )
                                    ],
                                  )
                                  : SizedBox()),
                              GestureDetector(
                                onTap: () {
                                  purchase(infoList[2],0);
                                },
                                child: Container(
                                  height: 20,
                                  padding: EdgeInsets.symmetric(horizontal: 10),
                                  alignment: Alignment.center,
                                  decoration: BoxDecoration(
                                      color: Color(0XFF0F172B),
                                      borderRadius: BorderRadius.circular(20)),
                                  child: Text(
                                    '今日买入',
                                    style: TextStyle(
                                        fontSize: 11, color: Color(0XFFFFFFFF)),
                                  ),
                                ),
                              )
                            ],
                          ),
                        ),
                        SizedBox(
                          width: 5,
                        ),
                      ],
                    ),
                  ],
                ),
              ),
              Transform.translate(
                offset: Offset(0, -50),
                child: Container(
                  padding: EdgeInsets.only(top: 20),
                  alignment: Alignment.center,
                  decoration: BoxDecoration(
                      color: Color(0XFFFFFFFF),
                      borderRadius: BorderRadius.only(
                        topLeft: Radius.circular(10),
                        topRight: Radius.circular(10),
                      )),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Container(
                        alignment: Alignment.center,
                        width: 70,
                        child: Text(
                          '排名',
                          style:
                              TextStyle(fontSize: 12, color: Color(0XFF999999)),
                        ),
                      ),
                      Text(
                        '用户',
                        style:
                            TextStyle(fontSize: 12, color: Color(0XFF999999)),
                      ),
                      Expanded(child: SizedBox()),
                      Container(
                        margin: EdgeInsets.only(right: 15),
                        alignment: Alignment.centerRight,
                        width: 90,
                        child: Text(
                          '今日买入',
                          style:
                              TextStyle(fontSize: 12, color: Color(0XFF999999)),
                        ),
                      ),
                    ],
                  ),
                ),
              ),
              Transform.translate(
                offset: Offset(0, -50),
                child: Container(
                  padding: EdgeInsets.only(top: 20),
                  alignment: Alignment.center,
                  decoration: BoxDecoration(
                    color: Color(0XFFFFFFFF),
                  ),
                  child: Obx(() => 
                  Column(
                        children: [

                          for (var item in infoList.asMap().entries)
                            Container(
                              margin: EdgeInsets.only(bottom: 20),
                              child: Row(
                                mainAxisAlignment:
                                    MainAxisAlignment.spaceBetween,
                                children: [
                                  Container(
                                    alignment: Alignment.center,
                                    width: 70,
                                    child: Text(
                                      '${item.key + 1}',
                                      style: TextStyle(
                                          fontSize: 12,
                                          color: Color(0XFF999999)),
                                    ),
                                  ),
                                  CircleAvatar(
                                      radius: 17,
                                      child: Image.network(
                                         '${item.value['headimg']}',
                                      ),
                                      // backgroundImage:
                                      //     AssetImage('static/aaa.png')
                                          ),
                                  SizedBox(
                                    width: 5,
                                  ),
                                  Column(
                                    crossAxisAlignment:
                                        CrossAxisAlignment.start,
                                    children: [
                                      Text('${item.value['name']}',
                                          style: TextStyle(
                                              fontSize: 12,
                                              color: Color(0XFF0F172B))),
                                      GestureDetector(
                                        onTap: () => {purchase(item.value,0)},
                                        child: Container(
                                          margin: EdgeInsets.only(top: 5),
                                          height: 20,
                                          padding: EdgeInsets.symmetric(
                                              horizontal: 10),
                                          decoration: BoxDecoration(
                                              color: Color(0XFF0F172B),
                                              borderRadius:
                                                  BorderRadius.circular(20)),
                                          child: Text(
                                            '今日买入',
                                            style: TextStyle(
                                                fontSize: 11,
                                                color: Color(0XFFFFFFFF)),
                                          ),
                                        ),
                                      ),
                                    ],
                                  ),
                                  Expanded(child: SizedBox()),
                                  Container(
                                    margin: EdgeInsets.only(right: 15),
                                    alignment: Alignment.centerRight,
                                    width: 90,
                                    child: 
                                    Row(
                                      children: [
                                        Text(
                                      '￥',
                                      style: TextStyle(
                                          fontSize: 12,
                                          color: Color(0XFF0F172B),
                                          fontWeight: FontWeight.bold),
                                    ),
                                    Text(
                                      '${item.value['score']}',
                                      style: TextStyle(
                                          fontSize: 18,
                                          color: Color(0XFF0F172B),
                                          fontWeight: FontWeight.bold),
                                    )
                                      ],
                                    )
                                    ,
                                  ),
                                ],
                              ),
                            ),
                       
                        ],
                      )
                      ),
                ),
              ),
            ],
          ),
        ),
        Container(
          padding: EdgeInsets.only(top: 5),
          margin: EdgeInsets.symmetric(vertical: 10),
          alignment: Alignment.center,
          decoration: BoxDecoration(
            color: Color(0XFFFFFFFF),
            boxShadow: [
              BoxShadow(
                color: Color.fromARGB(50, 0, 0, 0),
                offset: Offset(0, -1), // 向上偏移1个单位
                blurRadius: 1,
                spreadRadius: -1, // 收缩阴影，使阴影不会扩散到整个容器
              ),
            ],
          ),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Container(
                alignment: Alignment.center,
                width: 70,
                child: Image.asset(
                  'static/web/wode.png',
                  width: 26,
                  fit: BoxFit.fitWidth,
                ),
              ),
              CircleAvatar(
                  radius: 17,
                  child: Obx(
                    () => Image.network('${myInfo['headimg']}',
                        errorBuilder: (context, error, stackTrace) {
                      return SizedBox(
                        width: 50,
                      );
                    }),
                  )),
              SizedBox(
                width: 5,
              ),
              Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Obx(() => Text('${myInfo['name']}',
                      style:
                          TextStyle(fontSize: 12, color: Color(0XFF0F172B)))),
                  GestureDetector(
                    onTap: () {
                      purchase(myInfo,1);
                    },
                    child: Container(
                      alignment: Alignment.center,
                      margin: EdgeInsets.only(top: 5),
                      height: 20,
                      padding: EdgeInsets.symmetric(horizontal: 10),
                      decoration: BoxDecoration(
                          color: Color(0XFF0F172B),
                          borderRadius: BorderRadius.circular(20)),
                      child: Text(
                        '今日买入',
                        style:
                            TextStyle(fontSize: 12, color: Color(0XFFFFFFFF)),
                      ),
                    ),
                  )
                ],
              ),
              Expanded(child: SizedBox()),
              Container(
                margin: EdgeInsets.only(right: 15),
                alignment: Alignment.centerRight,
                width: 90,
                child:
                Row(
                  mainAxisAlignment: MainAxisAlignment.end,
                  children: [
                      Text(
                      '￥',
                      style: TextStyle(
                          fontSize: 12,
                          color: Color(0XFF0F172B),
                          fontWeight: FontWeight.bold),
                    ),
                    Obx(()=>
                    Text(
                      '${myInfo['score']??''}',
                      style: TextStyle(
                          fontSize: 18,
                          color: Color(0XFF0F172B),
                          fontWeight: FontWeight.bold),
                    )
                    )
                    ,
                  ],
                )
              ),
            ],
          ),
        ),
      ],
    ));
  }
}
